<template>
    <div class="image">
          <SelectTheRegion v-if="props.itemData.id == draggableItem.id" @delItem="delItem"></SelectTheRegion>
          <img src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" alt="">
    </div>
</template>

<script setup lang='ts'>
import SelectTheRegion from "@/pages/lowCode/components/lowCodeAdd/lowCodeContent/selectTheRegion/index.vue"
import { storeToRefs } from 'pinia'
import { lowCode } from "@/store/modules/lowCode"
const lowCodeStore = lowCode();
const { draggableItem } = storeToRefs(lowCodeStore);
const props: any = defineProps({
    itemData: {
        type: Object,
        default: []
    },
    del: {
        type: Function // 假设 del 是一个函数类型的 prop
    }
})
const delItem = () => {
    props.del(props.itemData)
}
</script>

<style lang='scss' scoped>
.image {
    width: 100%;
    height: 200px;
    position: relative;
    overflow: hidden;
  
    img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

// Your scoped styles here
</style>